<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript"  src="/${initParam.context_root }/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
		$('#id').bind("keyup",function(){
		$.ajax({
			url : "/${initParam.context_root}/idCheck.do",
			type : "post",	
			data :  "id="+$("#id").val(),
			success : function(res){				
				if(res.trim() =="yes"){
					$("#resultLayer").html("중복된아이디 입니다").css("color","red");
			   	}else{
				   	$("#resultLayer").html("사용가능한 아이디입니다.").css("color","blue");
					}
				},
				error:function(){
					alert("통신오류가 발생하였습니다. 재시도 해주세요");
				}
			});
		});
		
		$('#submit').bind("click",function(){
			alert($("#name").val()+"님 환영합니다");
		});
});
function getZipcode(){
	window.open("member_register_checkPost.jsp","searchaddress","width=500, height=500, resizable=no, scrollbars=yes");
	//1 : url    2: 팝업화면에 이름
}

function chkRegister(){
	var form = document.registerForm;
//ID check
		if(!form.id.value){
			alert("회원ID를 입력하세요.");
			form.id.focus();
			return false;
		}else if((form.id.value).length < 4){
			alert("회원ID는 5글자이상 넣으세요");
			form.id.focus();
			return false;
		}
	//비밀번호 check
		if(form.password.value<5){
			alert("비밀번호를 5글자 이상 입력하세요");
			form.password.focus();
			return false;
		}
	//이름 check
		if (!form.name.value){
			alert("이름을 입력하세요");
			form.name.focus();
			return false;
		}
		if(isNaN(form.registerNumber1.value)||isNaN(form.registerNumber2.value)){
			alert("주민번호는 숫자로 입력해주세요");
			return false;
		}else	if(form.registerNumber1.value.length!=6 ||form.registerNumber2.value.length!=7 ){
			alert("주민번호를 올바르게 입력하세요");
			return false;
		}
		if(form.hp1.value!="010" && form.hp1.value!="011"&&form.hp1.value !="016"&&form.hp1.value!="018"&&form.hp1.value!="017"){
			alert("휴대전화번호를 올바르게 입력하세요");
			return false;
		}
		if(isNaN(form.hp2.value)||isNaN(form.hp3.value)||form.hp1.value<=3|| form.hp2.value <= 2 ||form.hp3.value <=3){
			alert("휴대전화번호를 올바르게 입력하세요");
			return false;
		}
		if(!form.zipcode.value || !form.address1.value){
			alert("주소를 입력해주세요");
			return false;
		}
		//사진파일체크
		var fileName = form.upfile.value;
		var ext = fileNamesubstring(fileName.lastIndexOf(".")+1);
		if(ext!="jpg"&&ext!="png"&&ext!="jpeg"&&ext!="bmp"&&ext!="gif"){
			alert("그림파일만 업로드 가능합니다.");
			return false;
		}else if(!fileName){
			alert("사진을 등록해주세요");
			return false;
		}
	}

function resetTxt(txt){
	txt.value="";
}
</script>
</head>
<body>
<form name="registerForm" method="post" action="/${initParam.context_root }/registerMember.do" enctype="multipart/form-data" onsubmit="return chkRegister()">
	<table border="1">
		<tr>
			<td width="114" bgcolor="#FF9473">* 회원ID</td>
		    <td width="412"><input type="text" id="id" name="id" size="20" maxlength="15" onfocus="resetTxt(this)">
	        <span id="resultLayer"></span></td> 
	  </tr>
		<tr>
			<td bgcolor="#FF9473">* 비밀번호</td>
			<td><input type="password" name="password" size="20" maxlength="18" onfocus="resetTxt(this)"></td>
		</tr>
		<tr>
			<td  bgcolor="#FF9473">* 이름</td>
			<td><input type="text" name="name" id="name" size="20" maxlength="10" onfocus="resetTxt(this)"></td>
		</tr>
		<tr>
			<td bgcolor="#FF9473">* 주민등록번호</td>
			<td><input type="text" name="registerNumber1" maxlength="6" onfocus="resetTxt(this)"> - <input type="password" name="registerNumber2" maxlength="7" ></td>
		</tr>
		<tr>
			<td  bgcolor="#FF9473">* 휴대전화번호</td>
			<td><input type="text" id="hp1" name="hp1" size="3" maxlength="3">
					- <input type="text" name="hp2" size="4" maxlength="4"> - <input type="text" name="hp3" size="4"  maxlength="4"></td>
		</tr>
		<tr>
			<td  bgcolor="#FF9473">&nbsp;&nbsp;&nbsp;&nbsp;이메일</td>
			<td><input type="text" name="email"></td>
		</tr>
		  <tr>
			    <td rowspan="3"  bgcolor="#FF9473">* 주소</td>
			    <td><input type="text" size="3" name="zipcode">
							<input type="button" value="우편번호찾기" onclick="getZipcode()"></td>
		 </tr>
		 <tr>
			    <td><input type="text" name="address1" size="30" onfocus="resetTxt(this)"></td>
		 </tr>
		 <tr>
			    <td><input type="text" name="address2" size="30"></td>
		</tr>
		<tr>
			<td  bgcolor="#FF9473">* 사진파일</td>
			<td><input type="file" name="upfile"></td>
		</tr>
		<tr align="center">
			<td height="27" colspan="2" ><input type="submit" id="submit" name="submit" value="회원가입">
											  <input type="reset" value="다시작성">			</td>
		</tr>
	</table>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
</form>
</body>
</html>
